<template>
	<div class="issueflowIndexContent">
		<div class="issueflowIndexContentBox">
			<div class="issueflowIndexTitle">规则下发</div>
			<div class="issueflowIndexTab">
				<div :class="tabIndexActiveIndex == 0 ? 'tabIndexActive' : ''" @click="tabIndexClick(0)">
					<span>选择设备</span>
				</div>
				<div :class="tabIndexActiveIndex == 1 ? 'tabIndexActive' : ''" @click="tabIndexClick(1)">
					<span>成功下发</span>
					<!-- <span class="tabNumber">12</span> -->
				</div>
				<div :class="tabIndexActiveIndex == 2 ? 'tabIndexActive' : ''" @click="tabIndexClick(2)">
					<span>未成功下发</span>
					<!-- <span class="tabNumber">12</span> -->
				</div>
			</div>
			<div class="issueflowIndexForm">
				<div class="issueflowIndexFormBox" v-show="tabIndexActiveIndex == 0">
<!--					<div class="select-multiple">-->
<!--						<span>选择组</span>-->
<!--						<div class="select-multiple-box">-->
<!--							<el-select v-model="terminalGroupOptionsValue" filterable multiple placeholder="请选择" @change="handleMultipleGroup">-->
<!--								<el-option v-for="item in terminalGroupOptions" :key="item.value" :label="item.label" :value="item.value"> </el-option>-->
<!--							</el-select>-->
<!--						</div>-->
<!--					</div>-->
					<div class="select-single">
						<span>选择前置装置</span>
						<div class="select-single-box">
							<el-select v-model="terminalGroupSingleOptionsValue" placeholder="请选择" @change="handleSingleGroup">
								<el-option v-for="item in terminalGroupSingleOptions" :key="item.value" :label="item.label" :value="item.value">
								</el-option>
							</el-select>
						</div>
					</div>
					<div class="form-transfer">
						<span></span>
						<div class="form-transfer-box">
							<el-transfer
								filterable
								:filter-method="filterMethod"
								:titles="['待选择', '已选择']"
								filter-placeholder="请输入终端名称"
								v-model="TerminalDataPitch"
								:data="TerminalData"
							>
							</el-transfer>
						</div>
					</div>
					<div class="issueflow-btn">
						<span></span>
						<div class="issueflow-btn-box">
							<wj-Button type="save" @click="handleStartIssueflow">开始下发</wj-Button>
							<wj-Button type="save" @click="handleCancelBack">取消返回</wj-Button>
						</div>
					</div>
				</div>
				<div class="issueflowIndexFormBoxSuccess" v-show="tabIndexActiveIndex == 1">
					<div class="serarchContent">
						<div class="serarchBox">
							<el-input
								placeholder="请输关键字检索"
								type="text"
								v-model="searchValue"
								@keyup.enter.native="
									(e) => {
										e.target.blur();
									}
								"
								@blur="searchEvent"
							></el-input>
						</div>
					</div>
					<div class="tableContent">
						<el-table :data="tableDataSuccess" style="width: 100%">
							<el-table-column type="index" prop="id" width="80" label="序号"> </el-table-column>
							<el-table-column prop="name" label="所属情报板"> </el-table-column>
							<el-table-column prop="groupName" label="分组" width="280"> </el-table-column>
							<el-table-column prop="ipAddress" label="IP地址" width="180"> </el-table-column>
							<el-table-column prop="issueDate" label="下发时间" width="180"> </el-table-column>
							<el-table-column label="状态" width="180">
								<template>
									<span>下发成功</span>
								</template>
							</el-table-column>
						</el-table>
					</div>
					<div class="pageContent">
						<el-pagination
							background
							@size-change="handleSizeChange"
							@current-change="handleCurrentChange"
							:current-page="currentPage"
							:page-sizes="[10]"
							:page-size="pageSize"
							layout="total, sizes, prev, pager, next, jumper"
							:total="total"
						>
						</el-pagination>
					</div>
				</div>
				<div class="issueflowIndexFormBoxDefeat" v-show="tabIndexActiveIndex == 2">
					<div class="serarchContent">
						<div class="serarchBox">
							<el-input
								placeholder="请输关键字检索"
								type="text"
								v-model="searchValue1"
								@keyup.enter.native="
									(e) => {
										e.target.blur();
									}
								"
								@blur="searchEvent1"
							></el-input>
						</div>
					</div>
					<div class="tableContent">
						<el-table :data="tableDataFailed" style="width: 100%">
							<el-table-column type="index" prop="id" width="80" label="序号"> </el-table-column>
							<el-table-column prop="name" label="所属情报板"> </el-table-column>
							<el-table-column prop="groupName" label="分组" width="280"> </el-table-column>
							<el-table-column prop="ipAddress" label="IP地址" width="180"> </el-table-column>
							<el-table-column prop="issueDate" label="下发时间" width="180"> </el-table-column>
							<el-table-column label="状态" width="180">
								<template>
									<span>待下发</span>
								</template>
							</el-table-column>
						</el-table>
					</div>
					<div class="pageContent">
						<el-pagination
							background
							@size-change="handleSizeChange1"
							@current-change="handleCurrentChange1"
							:current-page="currentPage1"
							:page-sizes="[10]"
							:page-size="pageSize1"
							layout="total, sizes, prev, pager, next, jumper"
							:total="total1"
						>
						</el-pagination>
					</div>
				</div>
			</div>
		</div>
	</div>
</template>
<script>
import {
	issueflow_group,
	issueflow_terminal_byGroupId,
	issueflow_safety_rule,
	issueflow_safety_all_rule,
	issueflow_DateList,
	issueflow_strategy_rule,
	issueflow_strategy_all_rule,
	issueflow_admittance_rule,
	issueflow_admittance_all_rule,
	/*图片策略*/
	issueflow_img_rule,
	issueflow_img_all_rule,
} from "@/utils/request/api";
export default {
	name: "IssueflowIndex",
	data() {
		return {
			// 从哪个页面跳转到当前下发流程页面的  0安全防护  1策略下发  2发布源准入 3图片策略
			issueflowType: undefined,
			// 安全防护id（用来下发）
			safetyId: undefined,
			safetyIdList: [],
			// 策略下发id（用来下发）
			strategyId: undefined,
			strategyIdList: [],
			// 发布源准入id（用来下发）
			admittanceId: undefined,
			admittanceIdList: [],
			// 图片策略 （用来下发）
			imageStrategyId: undefined,
			imageStrategyIdList: [],
			// tab切换
			tabIndexActiveIndex: 0,
			// 搜索
			searchValue: "",
			searchValue1: "",
			// 终端分组（多选组）数据
			terminalGroupOptions: [],
			terminalGroupOptionsValue: [],
			// 终端分组（单选组）数据
			terminalGroupSingleOptions: [],
			terminalGroupSingleOptionsValue: "",
			// 分页当前页码——成功
			currentPage: 1,
			// 总页码
			total: 0,
			// 每页条数
			pageSize: 10,
			// 分页初始化页码
			pageNum: 1,
			// 分页当前页码——失败
			currentPage1: 1,
			// 总页码
			total1: 0,
			// 每页条数
			pageSize1: 10,
			// 分页初始化页码
			pageNum1: 1,
			// 成功下发
			tableDataSuccess: [
				// {
				// 	id: "1",
				// 	terminalName: "G20兰海高速北向南-001",
				// 	terminalGroup: "G20兰海高速北向南",
				// 	ipaddress: "11.11.11.11",
				// 	issueDate: "2022-02-02 23:00:00",
				// 	state: "下发成功",
				// },
				// {
				// 	id: "1",
				// 	terminalName: "G20兰海高速北向南-001",
				// 	terminalGroup: "G20兰海高速北向南",
				// 	ipaddress: "11.11.11.11",
				// 	issueDate: "2022-02-02 23:00:00",
				// 	state: "下发成功",
				// },
				// {
				// 	id: "1",
				// 	terminalName: "G20兰海高速北向南-001",
				// 	terminalGroup: "G20兰海高速北向南",
				// 	ipaddress: "11.11.11.11",
				// 	issueDate: "2022-02-02 23:00:00",
				// 	state: "下发成功",
				// },
				// {
				// 	id: "1",
				// 	terminalName: "G20兰海高速北向南-001",
				// 	terminalGroup: "G20兰海高速北向南",
				// 	ipaddress: "11.11.11.11",
				// 	issueDate: "2022-02-02 23:00:00",
				// 	state: "下发成功",
				// },
				// {
				// 	id: "1",
				// 	terminalName: "G20兰海高速北向南-001",
				// 	terminalGroup: "G20兰海高速北向南",
				// 	ipaddress: "11.11.11.11",
				// 	issueDate: "2022-02-02 23:00:00",
				// 	state: "下发成功",
				// },
			],
			// 未成功下发
			tableDataFailed: [
				// {
				// 	id: "1",
				// 	terminalName: "G20兰海高速北向南-001",
				// 	terminalGroup: "G20兰海高速北向南",
				// 	ipaddress: "11.11.11.11",
				// 	issueDate: "2022-02-02 23:00:00",
				// 	state: "下发成功",
				// },
				// {
				// 	id: "1",
				// 	terminalName: "G20兰海高速北向南-001",
				// 	terminalGroup: "G20兰海高速北向南",
				// 	ipaddress: "11.11.11.11",
				// 	issueDate: "2022-02-02 23:00:00",
				// 	state: "下发成功",
				// },
				// {
				// 	id: "1",
				// 	terminalName: "G20兰海高速北向南-001",
				// 	terminalGroup: "G20兰海高速北向南",
				// 	ipaddress: "11.11.11.11",
				// 	issueDate: "2022-02-02 23:00:00",
				// 	state: "下发成功",
				// },
				// {
				// 	id: "1",
				// 	terminalName: "G20兰海高速北向南-001",
				// 	terminalGroup: "G20兰海高速北向南",
				// 	ipaddress: "11.11.11.11",
				// 	issueDate: "2022-02-02 23:00:00",
				// 	state: "下发成功",
				// },
				// {
				// 	id: "1",
				// 	terminalName: "G20兰海高速北向南-001",
				// 	terminalGroup: "G20兰海高速北向南",
				// 	ipaddress: "11.11.11.11",
				// 	issueDate: "2022-02-02 23:00:00",
				// 	state: "下发成功",
				// },
			],
			// 终端数据
			TerminalData: [
				// { label: "上海", key: 0, pinyin: "上海" },
				// { label: "北京", key: 1, pinyin: "北京" },
				// { label: "广州", key: 2, pinyin: "广州" },
				// { label: "深圳", key: 3, pinyin: "深圳" },
				// { label: "南京", key: 4, pinyin: "南京" },
				// { label: "西安", key: 5, pinyin: "西安" },
				// { label: "成都", key: 6, pinyin: "成都" },
			],
			TerminalDataPitch: [],
		};
	},
	created() {
		this.issueflowType = this.$route.params.type;
		this.safetyId = this.$route.params.safetyId ? this.$route.params.safetyId : undefined;
		this.safetyIdList = this.$route.params.safetyIdList ? this.$route.params.safetyIdList : [];
		this.strategyId = this.$route.params.strategyId ? this.$route.params.strategyId : undefined;
		this.strategyIdList = this.$route.params.strategyIdList ? this.$route.params.strategyIdList : [];

		this.imageStrategyId = this.$route.params.imageStrategyId ? this.$route.params.imageStrategyId : undefined;
		this.imageStrategyIdList = this.$route.params.imageStrategyIdList ? this.$route.params.imageStrategyIdList : [];

		this.admittanceId = this.$route.params.admittanceId ? this.$route.params.admittanceId : undefined;
		this.admittanceIdList = this.$route.params.admittanceIdList ? this.$route.params.admittanceIdList : [];
	},
	mounted() {
		this.getAllTerminalGroup();
	},
	methods: {
		// tab切换
		tabIndexClick(index) {
			this.tabIndexActiveIndex = index;
			if (this.tabIndexActiveIndex == 1) {
				if (this.issueflowType == 0) {
					// 安全防护
					if (this.safetyId != undefined) {
						this.getSuccessList(this.pageNum, this.pageSize, this.issueflowType, [this.safetyId], 1);
					} else {
						this.getSuccessList(this.pageNum, this.pageSize, this.issueflowType, this.safetyIdList, 1);
					}
				} else if (this.issueflowType == 1) {
					// 策略下发
					if (this.strategyId != undefined) {
						this.getSuccessList(this.pageNum, this.pageSize, this.issueflowType, [this.strategyId], 1);
					} else {
						this.getSuccessList(this.pageNum, this.pageSize, this.issueflowType, this.strategyIdList, 1);
					}
				} else if (this.issueflowType == 2) {
					// 发布源准入
					if (this.admittanceId != undefined) {
						this.getSuccessList(this.pageNum, this.pageSize, this.issueflowType, [this.admittanceId], 1);
					} else {
						this.getSuccessList(this.pageNum, this.pageSize, this.issueflowType, this.admittanceIdList, 1);
					}
				} else if (this.issueflowType == 3) {
					// 图片策略
					if (this.imageStrategyId != undefined) {
						this.getSuccessList(this.pageNum, this.pageSize, this.issueflowType, [this.imageStrategyId], 1);
					} else {
						this.getSuccessList(this.pageNum, this.pageSize, this.issueflowType, this.imageStrategyIdList, 1);
					}
				}
			} else if (this.tabIndexActiveIndex == 2) {
				if (this.issueflowType == 0) {
					// 安全防护
					if (this.safetyId != undefined) {
						this.getFailedList(this.pageNum1, this.pageSize1, this.issueflowType, [this.safetyId], 0);
					} else {
						this.getFailedList(this.pageNum1, this.pageSize1, this.issueflowType, this.safetyIdList, 0);
					}
				} else if (this.issueflowType == 1) {
					// 策略下发
					if (this.strategyId != undefined) {
						this.getFailedList(this.pageNum1, this.pageSize1, this.issueflowType, [this.strategyId], 0);
					} else {
						this.getFailedList(this.pageNum1, this.pageSize1, this.issueflowType, this.strategyIdList, 0);
					}
				} else if (this.issueflowType == 2) {
					// 发布源准入
					if (this.admittanceId != undefined) {
						this.getFailedList(this.pageNum1, this.pageSize1, this.issueflowType, [this.admittanceId], 0);
					} else {
						this.getFailedList(this.pageNum1, this.pageSize1, this.issueflowType, this.admittanceIdList, 0);
					}
				} else if (this.issueflowType == 3) {
					// 图片策略
					if (this.imageStrategyId != undefined) {
						this.getFailedList(this.pageNum, this.pageSize, this.issueflowType, [this.imageStrategyId], 0);
					} else {
						this.getFailedList(this.pageNum, this.pageSize, this.issueflowType, this.imageStrategyIdList, 0);
					}
				}
			}
		},
		// 搜索---成功下发
		searchEvent() {
			console.log(this.searchValue);
			this.currentPage = 1;
			this.total = 0;
			this.pageSize = 10;
			this.pageNum = 1;
			if (this.issueflowType == 0) {
				// 安全防护
				if (this.safetyId != undefined) {
					this.getSearchSuccessList(this.pageNum, this.pageSize, this.searchValue, this.issueflowType, [this.safetyId], 1);
				} else {
					this.getSearchSuccessList(this.pageNum, this.pageSize, this.searchValue, this.issueflowType, this.safetyIdList, 1);
				}
			} else if (this.issueflowType == 1) {
				// 策略下发
				if (this.strategyId != undefined) {
					this.getSearchSuccessList(this.pageNum, this.pageSize, this.searchValue, this.issueflowType, [this.strategyId], 1);
				} else {
					this.getSearchSuccessList(this.pageNum, this.pageSize, this.searchValue, this.issueflowType, this.strategyIdList, 1);
				}
			} else if (this.issueflowType == 2) {
				// 发布源准入
				if (this.admittanceId != undefined) {
					this.getSearchSuccessList(this.pageNum, this.pageSize, this.searchValue, this.issueflowType, [this.admittanceId], 1);
				} else {
					this.getSearchSuccessList(this.pageNum, this.pageSize, this.searchValue, this.issueflowType, this.admittanceIdList, 1);
				}
			} else if (this.issueflowType == 3) {
				// 图片策略
				if (this.imageStrategyId != undefined) {
					this.getSearchSuccessList(this.pageNum, this.pageSize, this.searchValue, this.issueflowType, [this.imageStrategyId], 1);
				} else {
					this.getSearchSuccessList(this.pageNum, this.pageSize, this.searchValue, this.issueflowType, this.imageStrategyIdList, 1);
				}
			}
		},
		// 搜索---未成功下发
		searchEvent1() {
			console.log(this.searchValue1);
			this.currentPage1 = 1;
			this.total1 = 0;
			this.pageSize1 = 10;
			this.pageNum1 = 1;
			if (this.issueflowType == 0) {
				// 安全防护
				if (this.safetyId != undefined) {
					this.getSearchFailedList(this.pageNum1, this.pageSize1, this.searchValue1, this.issueflowType, [this.safetyId], 0);
				} else {
					this.getSearchFailedList(this.pageNum1, this.pageSize1, this.searchValue1, this.issueflowType, this.safetyIdList, 0);
				}
			} else if (this.issueflowType == 1) {
				// 策略下发
				if (this.strategyId != undefined) {
					this.getSearchFailedList(this.pageNum1, this.pageSize1, this.searchValue1, this.issueflowType, [this.strategyId], 0);
				} else {
					this.getSearchFailedList(this.pageNum1, this.pageSize1, this.searchValue1, this.issueflowType, this.strategyIdList, 0);
				}
			} else if (this.issueflowType == 2) {
				// 发布源准入
				if (this.admittanceId != undefined) {
					this.getSearchFailedList(this.pageNum1, this.pageSize1, this.searchValue1, this.issueflowType, [this.admittanceId], 0);
				} else {
					this.getSearchFailedList(this.pageNum1, this.pageSize1, this.searchValue1, this.issueflowType, this.admittanceIdList, 0);
				}
			} else if (this.issueflowType == 3) {
				// 图片策略
				if (this.imageStrategyId != undefined) {
					this.getSearchFailedList(this.pageNum1, this.pageSize1, this.searchValue1, this.issueflowType, [this.imageStrategyId], 0);
				} else {
					this.getSearchFailedList(this.pageNum1, this.pageSize1, this.searchValue1, this.issueflowType, this.imageStrategyIdList, 0);
				}
			}
		},
		// 终端组——多选
		handleMultipleGroup() {
			console.log(this.terminalGroupOptionsValue);
			this.terminalGroupSingleOptions = this.terminalGroupOptions.filter((x) => !this.terminalGroupOptionsValue.some((y) => y === x.value));
			this.terminalGroupSingleOptionsValue = "";
			console.log(this.terminalGroupOptions)
			console.log(this.terminalGroupSingleOptions);
		},
		// 终端——单选
		handleSingleGroup() {
			console.log(this.terminalGroupSingleOptionsValue);
			this.getTerminalByGroupID(this.terminalGroupSingleOptionsValue);
		},
		// 穿梭框搜索过滤
		filterMethod(query, item) {
			return item.pinyin.indexOf(query) > -1;
		},
		// 开始下发——下发成功后切换到下发成功tab
		toTabSuccess() {
			this.tabIndexActiveIndex = 1;
			this.currentPage = 1;
			this.total = 0;
			this.pageSize = 10;
			this.pageNum = 1;
			if (this.issueflowType == 0) {
				// 安全防护
				if (this.safetyId != undefined) {
					this.getSuccessList(this.pageNum, this.pageSize, this.issueflowType, [this.safetyId], 1);
				} else {
					this.getSuccessList(this.pageNum, this.pageSize, this.issueflowType, this.safetyIdList, 1);
				}
			} else if (this.issueflowType == 1) {
				// 策略下发
				if (this.strategyId != undefined) {
					this.getSuccessList(this.pageNum, this.pageSize, this.issueflowType, [this.strategyId], 1);
				} else {
					this.getSuccessList(this.pageNum, this.pageSize, this.issueflowType, this.strategyIdList, 1);
				}
			} else if (this.issueflowType == 2) {
				// 发布源准入
				if (this.admittanceId != undefined) {
					this.getSuccessList(this.pageNum, this.pageSize, this.issueflowType, [this.admittanceId], 1);
				} else {
					this.getSuccessList(this.pageNum, this.pageSize, this.issueflowType, this.admittanceIdList, 1);
				}
			} else if (this.issueflowType == 3) {
				// 图片策略
				if (this.imageStrategyId != undefined) {
					this.getSuccessList(this.pageNum, this.pageSize, this.issueflowType, [this.imageStrategyId], 1);
				} else {
					this.getSuccessList(this.pageNum, this.pageSize, this.issueflowType, this.imageStrategyIdList, 1);
				}
			}
		},
		// 开始下发decodeURIComponent
		handleStartIssueflow() {
			console.log(this.TerminalDataPitch);
			if (this.TerminalDataPitch.length > 0) {
				if (this.issueflowType == 0) {
					// 安全防护规则下发
					if (this.safetyId != undefined) {
						// 单条下发
						issueflow_safety_rule({
							sid: this.safetyId,
							clientIds: this.TerminalDataPitch,
							groupIds: this.terminalGroupOptionsValue,
						}).then((res) => {
							console.log(res);
							if (res.code == 200) {
								// 切换到下发成功
								this.toTabSuccess();
							} else {
								this.$msg.error("规则下发失败！");
							}
						});
					} else {
						// 批量下发
						issueflow_safety_all_rule({
							sidlist: this.safetyIdList,
							clientIds: this.TerminalDataPitch,
							groupIds: this.terminalGroupOptionsValue,
						}).then((res) => {
							console.log(res);
							if (res.code == 200) {
								// 切换到下发成功
								this.toTabSuccess();
							} else {
								this.$msg.error("规则下发失败！");
							}
						});
					}
				} else if (this.issueflowType == 1) {
					// 策略下发规则下发
					if (this.strategyId != undefined) {
						// 单条下发
						issueflow_strategy_rule({
							sid: this.strategyId,
							clientIds: this.TerminalDataPitch,
							groupIds: this.terminalGroupOptionsValue,
						}).then((res) => {
							console.log(res);
							if (res.code == 200) {
								// 切换到下发成功
								this.toTabSuccess();
							} else {
								this.$msg.error("规则下发失败！");
							}
						});
					} else {
						// 批量下发
						issueflow_strategy_all_rule({
							sidlist: this.strategyIdList,
							clientIds: this.TerminalDataPitch,
							groupIds: this.terminalGroupOptionsValue,
						}).then((res) => {
							console.log(res);
							if (res.code == 200) {
								// 切换到下发成功
								this.toTabSuccess();
							} else {
								this.$msg.error("规则下发失败！");
							}
						});
					}
				} else if (this.issueflowType == 2) {
					// 发布源准入规则下发
					if (this.admittanceId != undefined) {
						// 单条下发
						issueflow_admittance_rule({
							sid: this.admittanceId,
							clientIds: this.TerminalDataPitch,
							groupIds: this.terminalGroupOptionsValue,
						}).then((res) => {
							console.log(res);
							if (res.code == 200) {
								// 切换到下发成功
								this.toTabSuccess();
							} else {
								this.$msg.error("规则下发失败！");
							}
						});
					} else {
						// 批量下发
						issueflow_admittance_all_rule({
							sidlist: this.admittanceIdList,
							clientIds: this.TerminalDataPitch,
							groupIds: this.terminalGroupOptionsValue,
						}).then((res) => {
							console.log(res);
							if (res.code == 200) {
								// 切换到下发成功
								this.toTabSuccess();
							} else {
								this.$msg.error("规则下发失败！");
							}
						});
					}
				} else if (this.issueflowType == 3) {
					// 图片策略下发
					if (this.imageStrategyId != undefined) {
						// 单条下发
						issueflow_img_rule({
							sid: this.imageStrategyId,
							clientIds: this.TerminalDataPitch,
							groupIds: this.terminalGroupOptionsValue,
						}).then((res) => {
							console.log(res);
							if (res.code == 200) {
								// 切换到下发成功
								this.toTabSuccess();
							} else {
								this.$msg.error("规则下发失败！");
							}
						});
					} else {
						// 批量下发
						issueflow_img_all_rule({
							sidlist: this.imageStrategyIdList,
							clientIds: this.TerminalDataPitch,
							groupIds: this.terminalGroupOptionsValue,
						}).then((res) => {
							console.log(res);
							if (res.code == 200) {
								// 切换到下发成功
								this.toTabSuccess();
							} else {
								this.$msg.error("规则下发失败！");
							}
						});
					}
				}
			} else { 
				this.$msg.warning("请选择下发的终端组和终端！");
			}
		},
		// 取消返回
		handleCancelBack() {
			this.terminalGroupOptionsValue = [];
			this.terminalGroupSingleOptionsValue = "";
			this.TerminalDataPitch = [];
			history.go(-1);
		},
		// 分页组件事件——成功
		handleSizeChange(val) {
			console.log(`每页 ${val} 条`);
		},
		handleCurrentChange(val) {
			console.log(`当前页: ${val}`);
			if (this.searchValue != "") {
				if (this.issueflowType == 0) {
					// 安全防护
					if (this.safetyId != undefined) {
						this.getSearchSuccessList(val, this.pageSize, this.searchValue, this.issueflowType, [this.safetyId], 1);
					} else {
						this.getSearchSuccessList(val, this.pageSize, this.searchValue, this.issueflowType, this.safetyIdList, 1);
					}
				} else if (this.issueflowType == 1) {
					// 策略下发
					if (this.strategyId != undefined) {
						this.getSearchSuccessList(val, this.pageSize, this.searchValue, this.issueflowType, [this.strategyId], 1);
					} else {
						this.getSearchSuccessList(val, this.pageSize, this.searchValue, this.issueflowType, this.strategyIdList, 1);
					}
				} else if (this.issueflowType == 2) {
					// 发布源准入
					if (this.admittanceId != undefined) {
						this.getSearchSuccessList(val, this.pageSize, this.searchValue, this.issueflowType, [this.admittanceId], 1);
					} else {
						this.getSearchSuccessList(val, this.pageSize, this.searchValue, this.issueflowType, this.admittanceIdList, 1);
					}
				}
			} else {
				if (this.issueflowType == 0) {
					// 安全防护
					if (this.safetyId != undefined) {
						this.getSuccessList(val, this.pageSize, this.issueflowType, [this.safetyId], 0);
					} else {
						this.getSuccessList(val, this.pageSize, this.issueflowType, this.safetyIdList, 0);
					}
				} else if (this.issueflowType == 1) {
					// 策略下发
					if (this.strategyId != undefined) {
						this.getSuccessList(val, this.pageSize, this.issueflowType, [this.strategyId], 0);
					} else {
						this.getSuccessList(val, this.pageSize, this.issueflowType, this.strategyIdList, 0);
					}
				} else if (this.issueflowType == 2) {
					// 发布源准入
					if (this.admittanceId != undefined) {
						this.getSuccessList(val, this.pageSize, this.issueflowType, [this.admittanceId], 0);
					} else {
						this.getSuccessList(val, this.pageSize, this.issueflowType, this.admittanceIdList, 0);
					}
				}
			}
		},
		// 分页组件事件——失败
		handleSizeChange1(val) {
			console.log(`每页 ${val} 条`);
		},
		handleCurrentChange1(val) {
			console.log(`当前页: ${val}`);
			if (this.searchValue != "") {
				if (this.issueflowType == 0) {
					// 安全防护
					if (this.safetyId != undefined) {
						this.getSearchFailedList(val, this.pageSize1, this.searchValue1, this.issueflowType, [this.safetyId], 1);
					} else {
						this.getSearchFailedList(val, this.pageSize1, this.searchValue1, this.issueflowType, this.safetyIdList, 1);
					}
				} else if (this.issueflowType == 1) {
					// 策略下发
					if (this.strategyId != undefined) {
						this.getSearchFailedList(val, this.pageSize1, this.searchValue1, this.issueflowType, [this.strategyId], 1);
					} else {
						this.getSearchFailedList(val, this.pageSize1, this.searchValue1, this.issueflowType, this.strategyIdList, 1);
					}
				} else if (this.issueflowType == 2) {
					// 发布源准入
					if (this.admittanceId != undefined) {
						this.getSearchFailedList(val, this.pageSize1, this.searchValue1, this.issueflowType, [this.admittanceId], 1);
					} else {
						this.getSearchFailedList(val, this.pageSize1, this.searchValue1, this.issueflowType, this.admittanceIdList, 1);
					}
				}
			} else {
				if (this.issueflowType == 0) {
					// 安全防护
					if (this.safetyId != undefined) {
						this.getFailedList(val, this.pageSize1, this.issueflowType1, [this.safetyId], 0);
					} else {
						this.getFailedList(val, this.pageSize1, this.issueflowType1, this.safetyIdList, 0);
					}
				} else if (this.issueflowType == 1) {
					// 策略下发
					if (this.strategyId != undefined) {
						this.getFailedList(val, this.pageSize1, this.issueflowType1, [this.strategyId], 0);
					} else {
						this.getFailedList(val, this.pageSize1, this.issueflowType1, this.strategyIdList, 0);
					}
				} else if (this.issueflowType == 2) {
					// 发布源准入
					if (this.admittanceId != undefined) {
						this.getFailedList(val, this.pageSize1, this.issueflowType1, [this.admittanceId], 0);
					} else {
						this.getFailedList(val, this.pageSize1, this.issueflowType1, this.admittanceIdList, 0);
					}
				}
			}
		},
		// 查询所有的终端组
		getAllTerminalGroup() {
			issueflow_group().then((res) => {
				console.log(res);
				if (res.code == 200) {
					res.data.forEach((item) => {
						this.terminalGroupOptions.push({
							label: item.groupName,
							value: item.id,
						});
						this.terminalGroupSingleOptions.push({
							label: item.groupName,
							value: item.id,
						})
					});
				} else {
					this.$msg.error("获取终端组失败！");
				}
			});
		},
		// 通过终端组id查询该组下面的所有终端
		getTerminalByGroupID(groupId) {
			issueflow_terminal_byGroupId({
				groupId: groupId,
			}).then((res) => {
				console.log(res);
				if (res.code == 200) {
					this.TerminalData = [];
					res.data.forEach((item) => {
						this.TerminalData.push({
							label: item.name,
							key: item.serial,
							pinyin: item.name,
						});
					});
				} else {
					this.$msg.error("通过终端组ID查询终端数据失败！");
				}
			});
		},
		// 查询成功下发数据
		getSuccessList(page, size, selectType, sidList, result) {
			issueflow_DateList({
				page: page,
				size: size,
				selectType: selectType,
				sidList: decodeURIComponent(sidList),
				result: result,
			}).then((res) => {
				console.log(res);
				this.tableDataSuccess = res.data;
			});
		},
		// 搜索成功下发
		getSearchSuccessList(page, size, keyword, selectType, sidList, result) {
			issueflow_DateList({
				page: page,
				size: size,
				keyword: keyword,
				selectType: selectType,
				sidList: decodeURIComponent(sidList),
				result: result,
			}).then((res) => {
				console.log(res);
				this.tableDataSuccess = res.data;
			});
		},
		// 查询失败下发数据
		getFailedList(page, size, selectType, sidList, result) {
			issueflow_DateList({
				page: page,
				size: size,
				selectType: selectType,
				sidList: decodeURIComponent(sidList),
				result: result,
			}).then((res) => {
				console.log(res);
				this.tableDataFailed = res.data;
			});
		},
		// 搜索失败下发
		getSearchFailedList(page, size, keyword, selectType, sidList, result) {
			issueflow_DateList({
				page: page,
				size: size,
				keyword: keyword,
				selectType: selectType,
				sidList: decodeURIComponent(sidList),
				result: result,
			}).then((res) => {
				console.log(res);
				this.tableDataFailed = res.data;
			});
		},
	},
};
</script>
<style lang="less" scoped>
.issueflowIndexContent {
	width: 100%;
	height: 100%;
	padding: 12px 20px;
	box-sizing: border-box;
	background: #ffffff;
	overflow: hidden;
	.issueflowIndexContentBox {
		width: 104%;
		height: 100%;
		overflow-y: scroll;
		.issueflowIndexTitle {
			width: 100%;
			height: 36px;
			line-height: 36px;
			font-size: 18px;
		}
		.issueflowIndexTab {
			width: 98%;
			height: 48px;
			margin: 12px 0;
			display: flex;
			flex-direction: row;
			justify-content: flex-start;
			align-items: center;
			div {
				width: 145px;
				height: 36px;
				font-size: 14px;
				line-height: 36px;
				border: 1px solid #d8d8d8;
				border-right: none;
				background: #f2f2f2;
				color: #82b808;
				text-align: center;
				display: flex;
				flex-direction: row;
				justify-content: center;
				align-items: center;
				span {
					display: inline-block;
					height: 18px;
					line-height: 18px;
				}
				span:first-child {
					margin-right: 12px;
				}
				span.tabNumber {
					border: 1px solid #d8d8d8;
					padding: 2px 4px;
					text-align: center;
				}
			}
			div:last-child {
				border-right: 1px solid #d8d8d8;
			}
			div.tabIndexActive {
				background: #fff;
				color: #333333;
			}
			div:hover {
				cursor: pointer;
			}
		}
		.issueflowIndexForm {
			width: 98%;
			height: calc(100% - 36px - 48px - 24px);
			.issueflowIndexFormBox {
				width: 100%;
				height: 100%;
				.select-multiple {
					width: 100%;
					margin: 12px 0;
					display: flex;
					flex-direction: row;
					justify-content: flex-start;
					align-items: flex-start;
					span {
						display: inline-block;
						width: 120px;
						margin: 0 12px;
						font-size: 16px;
						line-height: 40px;
					}
					.select-multiple-box {
						width: 45%;
						/deep/ .el-select {
							width: 100%;
						}
					}
				}
				.select-single {
					width: 100%;
					margin: 12px 0;
					display: flex;
					flex-direction: row;
					justify-content: flex-start;
					align-items: flex-start;
					span {
						display: inline-block;
						width: 120px;
						margin: 0 12px;
						font-size: 16px;
						line-height: 40px;
					}
					.select-single-box {
						width: 45%;
						/deep/ .el-select {
							width: 100%;
						}
					}
				}
				.form-transfer {
					width: 100%;
					height: 68%;
					margin: 12px 0;
					display: flex;
					flex-direction: row;
					justify-content: flex-start;
					align-items: flex-start;
					span {
						display: inline-block;
						width: 120px;
						margin: 0 12px;
						font-size: 16px;
						line-height: 40px;
					}
					.form-transfer-box {
						width: 60%;
						height: 100%;
						/deep/ .el-transfer {
							width: 100%;
							height: 100%;
						}
						/deep/ .el-transfer-panel {
							width: 36%;
							height: 100%;
						}
						/deep/ .el-transfer-panel__body {
							/*height: 87%;*/
							height: 380px;
						}
						/deep/ .el-transfer-panel__list.is-filterable {
							/*height: 88%;*/
							height: 328px;
						}
					}
				}
				.issueflow-btn {
					width: 100%;
					margin: 24px 0;
					display: flex;
					flex-direction: row;
					justify-content: flex-start;
					align-items: flex-start;
					span {
						display: inline-block;
						width: 120px;
						margin: 0 12px;
						font-size: 16px;
						line-height: 40px;
					}
					.issueflow-btn-box {
						width: 45%;
						display: flex;
						flex-direction: row;
						justify-content: flex-start;
						align-items: center;
						[class*="wj-button-"] {
							font-size: 14px;
							padding: 8px 18px;
							margin-right: 12px;
						}
					}
				}
			}
			.issueflowIndexFormBox::before {
				content: "";
				display: table;
			}
			.issueflowIndexFormBoxSuccess {
				width: 100%;
				height: 100%;
				display: flex;
				flex-direction: column;
				justify-content: flex-start;
				align-items: center;
				.serarchContent {
					width: 98%;
					height: 48px;
					display: flex;
					flex-direction: row;
					justify-content: flex-end;
					align-items: center;
					.serarchBox {
						width: 15%;
						height: 100%;
						display: flex;
						flex-direction: row;
						justify-content: flex-end;
						align-items: center;
						/deep/ .el-input {
							font-size: 16px;
						}
					}
				}
				.tableContent {
					width: 98%;
					height: calc(100% - 48px - 36px - 28px);
					margin: 14px 0;
					/deep/ .el-table {
						border-left: 1px solid #ebeef5;
						border-right: 1px solid #ebeef5;
						border-top: 1px solid #ebeef5;
					}
					/deep/ .el-link {
						margin: 0 12px 0 0;
					}
				}
				.pageContent {
					width: 98%;
					height: 36px;
					display: flex;
					flex-direction: row;
					justify-content: flex-end;
					align-items: center;
				}
			}
			.issueflowIndexFormBoxDefeat {
				width: 100%;
				height: 100%;
				display: flex;
				flex-direction: column;
				justify-content: flex-start;
				align-items: center;
				.serarchContent {
					width: 98%;
					height: 48px;
					display: flex;
					flex-direction: row;
					justify-content: flex-end;
					align-items: center;
					.serarchBox {
						width: 15%;
						height: 100%;
						display: flex;
						flex-direction: row;
						justify-content: flex-end;
						align-items: center;
						/deep/ .el-input {
							font-size: 16px;
						}
					}
				}
				.tableContent {
					width: 98%;
					height: calc(100% - 48px - 36px - 28px);
					margin: 14px 0;
					/deep/ .el-table {
						border-left: 1px solid #ebeef5;
						border-right: 1px solid #ebeef5;
						border-top: 1px solid #ebeef5;
					}
					/deep/ .el-link {
						margin: 0 12px 0 0;
					}
				}
				.pageContent {
					width: 98%;
					height: 36px;
					display: flex;
					flex-direction: row;
					justify-content: flex-end;
					align-items: center;
				}
			}
		}
	}
}
</style>
